<template>
  <div class="page" data-page="layer2D" style="z-index: 2;">
    <div class="navbar">
      <div class="navbar-inner">
        <div class="left" id="my-back">
            <a href="#" class="link back" @click="$root.backToTab()">
              <i class="icon icon-back"></i>
              <span class="ios-only">Back</span>
            </a>
        </div>
        <div  class="title sliding" style="left: -29px;">三维地图</div>
      </div>
    </div>
    <div class="page-content" >
        <div class="row layer2D-top" style="background: #fff;">
            <div class="link col item-title" id="unit_piker">
                <span>联网单位</span>
                <i class="select-down"></i>
            </div>
            <div class="link col item-title"  id="build_select">
                <span>建筑物</span>
                <i class="select-down"></i>
            </div>
        </div>
        <div style="height: 1px;" class="line-split"></div>
        <div id="mapContent" class="block">

        </div>
    </div>
  </div>
</template>
<style scoped>
  #mapContent{
    height: 100%;
    width: 100%;
  }
  .layer2D-top{
    padding-top: 5px;
  }
  .layer2D-top .col{
    margin: 10px auto;
    font-size: 14px;
    text-align: center;
  }
  .layer2D-top .col i{
    font-size: 14px;
  }
  .layer2D-content .block-strong{
    margin-top: 0px;
  }
  #layer3D_list a{
    display: inline-block;
    width: 100%;
    font-size: 14px;
    color: #666666;
  }
  .build-sheet-modal .list{
    margin: 0px;
  }
  .item-title span{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .every-layer-list{
    width: 100%;
    position: relative;
    height: 0;
    padding-bottom: 56.25%;
  }
  .every-layer-list-pic{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .layer2D-content .block-strong:after{
    height: 0px !important;
  }
</style>
<script>
  return{
      data: function () {
        return {
            currentOrgId:0,
        }
      },
      methods: {

      },
      on: {
        pageInit: function(e, page) {
          var self = this;
          var app = self.$app;
          if (self.$route.params.viewType == 4){
                jQuery("#my-back").click(function(e) {
                   app.methods.backToTab('/layer3D/')
                });
          }
          if(userInfor.isMuilUnitUser == 0){
            //单联网单位
            $("#unit_piker").hide();
            $("#mapContent").empty();
            self.currentOrgId = userInfor.organizationIds;
            if (self.currentOrgId  == 124 || self.currentOrgId  == 122) {
                if (map){
                    map.dispose();
                }
                int_MainFmap(self.currentOrgId);
            } else {
                //暂无数据
                $("#mapContent").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"></div>`);
            }
          } else {
              if (currentUserUnitListData.length!=0){
                  for (var i = 0;i < currentUserUnitListData.length;i++) {
                      if (currentUserUnitListData[i].shortName == '南京南站') {
                           $("#unit_piker span").html(currentUserUnitListData[i].shortName);
                           self.currentOrgId = currentUserUnitListData[i].organizationId;
                           $("#mapContent").empty();
                           if (map){
                               map.dispose();
                           }
                           int_MainFmap(self.currentOrgId);
                      }
                  }
              }
            //多联网单位
            $("#unit_piker").show().click(function(event) {
                loadSelectUnitFunc(function(data){
                    self.currentOrgId = data.orgId;
                    $("#build_select span").html('建筑物');
                    $("#unit_piker span").html(data.orgName);
                    $("#mapContent").empty();
                     if (self.currentOrgId == 124 || self.currentOrgId == 122) {
                         if (map){
                             map.dispose();
                         }
                         int_MainFmap(self.currentOrgId);
                     } else {
                        $("#mapContent").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                     }
                });
            });
          }

          $("#build_select").show().click(function(event) {
            if(self.currentOrgId != 0){
                loadSelectBuildFun(self.currentOrgId,function(data){
                    if(!map || !map.groupIDs){
                        //暂无数据
                        $("#mapContent").empty();
                        $("#mapContent").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                        return;
                    }
                    if (data.indoorId < 1 || data.indoorId > 5) {
                        $("#build_select span").html(data.buildName);
                        app.methods.showToastBottom("该楼层没有三维地图,请重新选择楼层。");
                        return;
                    }
                    for(var i in map.groupIDs){
                        map.getFMGroup(map.groupIDs[i]).show = false;
                    }
                    map.getFMGroup(currentIndoorId).show = true;
                    $("#build_select span").html(data.buildName);
                    map.focusGroupID = currentIndoorId;
                    $("#build_select span").html(data.buildName);
                });
            } else { //多
                app.methods.showToastCenter("请选择联网单位");
            }
          });

        },
      }
  }
</script>